<template>
    <my-form @submit="dialogSubmit" @cancle="dialogCancle" v-model="form" ref="form">
		<el-form-item label="待分配部门" label-width="120" prop="dept" :rules="newRule('待分配部门', 'required')">
            <dept-selector v-model="form.dept" placeholder="部门" @change="deptChange" @input="deptSeled"></dept-selector>
        </el-form-item>
		<el-form-item label-width="0" prop="prople">
			<select-people v-model="form.people" title2="部门内人员"></select-people>
		</el-form-item>
	</my-form>
</template>

<script>
import deptSelector from '../dept/component/dept-selector'
import selectPeople from './component/select-people'

export default {
    props: [],
    components: {deptSelector, selectPeople},
    data () {
        return {
            form: {
				people: [],
				dept: '',
				deptrowguid: ''
			}
        }
    },
    methods: {
        deptChange: function(e){
			this.form.deptrowguid = e.rowguid;
		},
		dialogSubmit: function(){
            var that = this;
			this.$post(this.$store.getters.sysUrl+'/dwdept/allotuser', {
				rowguid: that.form.deptrowguid,
				userids: that.form.people.join(',')
			}, function(data, res){
				ShowMsg.call(this, res.msg);
				this.dialogCancle();
			})
        },
        dialogCancle: function(){
            this.$emit('close');
        },
		deptSeled: function(e){
			var that = this;
			this.$get(this.$store.getters.sysUrl + '/dwdept/userlist', {
				deptcode: e
			}, function(data){
				data = data || [];
				that.form.people = data.map(function(item){
					return item.userid;
				});
			})
		},
        reload() {
            this.form.people = [];
        }
    },
    mounted: function() {

    }
}
</script>

<!-- Add "scoped" attribute to limit CSS to this component only -->
<style scoped>

</style>
